<template>
	<view class="vcode_shell">
		
		<view class="number">
			验证码已发送至手机号
		</view>
		<view  style="height: 50rpx;">
			
		</view>
		<u-code-input v-model="value2" mode="line" @finish="finishvcode"></u-code-input>
	<!-- 	<view class="number">
			{{totalRecharge}}
		</view> -->
	</view>
</template>
<!-- ■数字自增组件(页面) -->
<script>
	import { uploadFile } from '@/tools/publicfun.js';
	export default {
		data() {
			return {
				value2:'',
				totalRecharge:0,
			}
		},
		onLoad() {
			this.totalRechargeAnimateNumber(5000)
			setTimeout(()=>{
				this.totalRechargeAnimateNumber(8000)
			},3000)
			setTimeout(()=>{
				this.totalRechargeAnimateNumber(9000)
			},5000)
			setTimeout(()=>{
				this.totalRechargeAnimateNumber(9001)
			},7000)
		},
		methods: {
			 totalRechargeAnimateNumber(target) {
			        const targetNumber = target; // 目标数字
			        const duration = 1500; // 动画持续时间
			        const steps = 50; // 动画步数
			        const stepDuration = duration / steps; // 每步的持续时间
			        const increment = (targetNumber - this.totalRecharge) / steps; // 每步的增量
			        let currentNumber = 0 || this.totalRecharge;
			        let stepCount = 0 ;
			        const timer = setInterval(() => {
			          currentNumber += increment;
			          stepCount++;
			          if (stepCount >= steps) {
			            currentNumber = targetNumber;
			            clearInterval(timer);
			          }
			          this.totalRecharge = Math.floor(currentNumber); // 更新数字
			
			        }, stepDuration);
			      },
			finishvcode(){
				uni.navigateTo({
					 url:'../index/next'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.vcode_shell{
	width: 100vw;
	height: 100vh;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}
</style>
